// 动态设置帖子头像
document.querySelectorAll('.post-item').forEach(postItem => {
    const postAuthor = postItem.querySelector('.post-author').textContent;
    const postAvatar = postItem.querySelector('.post-avatar');
    postAvatar.textContent = postAuthor.charAt(0);
});

// 动态发帖功能
const postList = document.querySelector('.post-list');
// 修改帖子数据结构，添加id字段
let posts = [
    { id: 1, author: '阿布', content: '这是一个关于C语言的帖子内容。' },
    { id: 2, author: '成大', content: '这是一个关于Python的帖子内容。' }
];

// 存储帖子点赞状态
let likedPosts = {};

// 初始化搜索功能
function initSearchFunctionality() {
    // 查找已存在的搜索框元素
    const searchBox = document.querySelector('.search-box');
    const searchSvgs = document.querySelectorAll('.Search-svg'); // 获取所有搜索图标
    const tagArea = document.querySelector('.tag-area');
    
    // 检查必要的元素是否存在
    if (!searchBox) {
        console.error('未找到搜索框元素');
        return;
    }
    
    // 向搜索框添加输入框
    searchBox.innerHTML = `
        <input type="text" id="searchInput" placeholder="输入作者名称或帖子ID搜索" />
    `;
    
    // 为所有搜索图标添加点击事件和指针样式
    searchSvgs.forEach(svg => {
        svg.style.cursor = 'pointer';
        svg.addEventListener('click', performSearch);
    });
    
// 为输入框添加回车搜索功能
    const searchInput = document.getElementById('searchInput');
    if (searchInput) {
        searchInput.addEventListener('keypress', (e) => {
            if (e.key === 'Enter') {
                performSearch();
            }
        });
    }
    
    // 检查标签区域是否存在
    if (tagArea) {
        // 创建并添加显示全部帖子按钮到标签区域
        const showAllButton = document.createElement('span');
        showAllButton.className = 'tag';
        showAllButton.textContent = '全部帖子';
        showAllButton.style.cursor = 'pointer';
        showAllButton.addEventListener('click', () => {
            if (searchInput) {
                searchInput.value = '';
            }
            renderPosts();
        });
        tagArea.appendChild(showAllButton);
    }
}

// 执行搜索操作
function performSearch() {
    const searchInput = document.getElementById('searchInput');
    if (!searchInput) return;
    
    const searchValue = searchInput.value.trim();
    if (!searchValue) {
        alert('请输入搜索内容');
        return;
    }
    
    // 判断是搜索作者还是搜索ID
    // 如果输入的是数字，则尝试作为ID搜索
    if (!isNaN(searchValue) && searchValue !== '') {
        const postId = parseInt(searchValue);
        findPostById(postId);
    } else {
        // 否则作为作者名称搜索
        findAuthorPosts(searchValue);
    }
}

// 确保在renderPosts函数中有正确的跳转逻辑
function renderPosts(filteredPosts = null) {
    postList.innerHTML = '';
    const postsToRender = filteredPosts || posts;
    
    postsToRender.forEach(post => {
        const postItem = document.createElement('div');
        postItem.classList.add('post-item');
        postItem.innerHTML = `
            <div class="post-info">
                <div class="post-avatar">${post.author.charAt(0)}</div>
                <span class="post-author">${post.author}</span>
                <p class="post-content">${post.content}</p>
            </div>
            <div class="post-actions">
                <button class="like-button" data-post-id="${post.id}">${likedPosts[post.id] ? '已点赞' : '点赞'}</button>
                <button class="update-button" data-post-id="${post.id}">更新</button>
                <button class="delete-button" data-post-id="${post.id}">删除</button>
            </div>
        `;
        
        // 为帖子主体添加点击事件（跳转到详情页）
        const postInfo = postItem.querySelector('.post-info');
        postInfo.addEventListener('click', () => {
            window.location.href = `post-detail.html?author=${encodeURIComponent(post.author)}&content=${encodeURIComponent(post.content)}&id=${post.id}`;
        });
        
        // 为删除按钮添加点击事件
        const deleteButton = postItem.querySelector('.delete-button');
        deleteButton.addEventListener('click', (e) => {
            e.stopPropagation(); // 阻止事件冒泡，避免触发帖子主体的点击事件
            const postId = parseInt(e.currentTarget.dataset.postId);
            deletePost(postId);
        });
        
        // 为点赞按钮添加点击事件
        const likeButton = postItem.querySelector('.like-button');
        likeButton.addEventListener('click', (e) => {
            e.stopPropagation();
            const postId = parseInt(e.currentTarget.dataset.postId);
            
            if (likedPosts[postId] === true) {
                unlikePost(postId);
            } else {
                likePost(postId);
            }
        });
        
        // 为更新按钮添加点击事件
        const updateButton = postItem.querySelector('.update-button');
        updateButton.addEventListener('click', (e) => {
            e.stopPropagation();
            const postId = parseInt(e.currentTarget.dataset.postId);
            openUpdateModal(postId);
        });
        
        postList.appendChild(postItem);
    });
}

// 点赞帖子函数
function likePost(postId) {
    console.log('尝试点赞帖子，ID:', postId);
    
    // 模拟用户ID（实际应用中可能从登录状态获取）
    const userId = 1; // 这里假设用户ID为1，实际应用中应该从登录状态获取
    
    // 调用点赞接口
    fetch('/api/post/like', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
        },
        body: JSON.stringify({
            articalId: postId,
            userId: userId
        })
    })
    .then(response => {
        console.log('点赞请求已发送，正在等待响应...');
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('点赞成功，服务器返回:', data);
        
        // 显示成功提示
        alert(data.message || '点赞成功');
    })
    .catch(error => {
        console.error('点赞失败:', error);
        alert('点赞失败: ' + error.message);
    });
}

// 执行搜索操作
function performSearch() {
    const searchInput = document.getElementById('searchInput');
    if (!searchInput) return;
    
    const searchValue = searchInput.value.trim();
    if (!searchValue) {
        alert('请输入搜索内容');
        return;
    }
    
    // 判断是搜索作者还是搜索ID
    // 如果输入的是数字，则尝试作为ID搜索
    if (!isNaN(searchValue) && searchValue !== '') {
        const postId = parseInt(searchValue);
        findPostById(postId);
    } else {
        // 否则作为作者名称搜索
        findAuthorPosts(searchValue);
    }
}

// 查找作者所有帖子函数
function findAuthorPosts(authorName) {
    console.log('尝试查找作者帖子，作者:', authorName);
    
    // 调用查找接口
    fetch(`/api/post/findId/${encodeURIComponent(authorName)}`, {
        method: 'GET',
        headers: {
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
            'Content-Type': 'application/x-www-form-urlencoded'
        }
    })
    .then(response => {
        console.log('查找请求已发送，正在等待响应...');
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('查找成功，服务器返回:', data);
        
        if (data.code === 200 && data.data && Array.isArray(data.data)) {
            // 获取该作者的帖子ID列表
            const authorPostIds = data.data;
            
            // 在本地数据中查找对应的帖子
            const authorPosts = posts.filter(post => 
                authorPostIds.includes(post.id) && post.author === authorName
            );
            
            if (authorPosts.length > 0) {
                // 渲染该作者的帖子
                renderPosts(authorPosts);
                alert(`找到作者 "${authorName}" 的 ${authorPosts.length} 个帖子`);
            } else {
// 清空列表，显示未找到提示
                postList.innerHTML = `<div class="no-posts-message">未找到作者 "${authorName}" 的帖子</div>`;
            }
        } else {
            throw new Error(data.message || '获取作者帖子失败');
        }
    })
    .catch(error => {
        console.error('查找失败:', error);
        alert('查找失败: ' + error.message);
        // 出错时显示全部帖子
        renderPosts();
    });
}

// 根据ID查找帖子函数
function findPostById(postId) {
    console.log('尝试根据ID查找帖子，ID:', postId);
    
    // 调用查找接口
    fetch(`/api/post/findPost/${postId}`, {
        method: 'GET',
        headers: {
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
            'Content-Type': 'application/x-www-form-urlencoded'
        }
    })
    .then(response => {
        console.log('查找请求已发送，正在等待响应...');
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('查找成功，服务器返回:', data);
        
        if (data.code === 200 && data.data) {
            // 找到帖子，创建一个只包含该帖子的数组并渲染
            const foundPost = {
                id: postId,
                author: data.data.author,
                content: data.data.content
            };
            
            // 更新本地数据（如果需要）
            const existingPostIndex = posts.findIndex(p => p.id === postId);
            if (existingPostIndex >= 0) {
                posts[existingPostIndex] = foundPost;
            } else {
                posts.push(foundPost);
            }
            
            renderPosts([foundPost]);
            alert(`找到帖子，作者: ${data.data.author}`);
        } else {
            throw new Error(data.message || '获取帖子失败');
        }
    })
    .catch(error => {
        console.error('查找失败:', error);
        alert('查找失败: ' + error.message);
        // 出错时显示全部帖子
        renderPosts();
    });
}

// 删除帖子函数
function deletePost(postId) {
    // 显示确认对话框
    if (!confirm('确定要删除这个帖子吗？')) {
        return;
    }
    
    console.log('尝试删除帖子，ID:', postId);
    
    // 调用删除接口
    fetch(`/api/post/delete/${postId}`, {
        method: 'DELETE',
        headers: {
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
            'Content-Type': 'application/x-www-form-urlencoded'
        }
    })
    .then(response => {
        console.log('删除请求已发送，正在等待响应...');
        
        // 检查响应状态码
        if (!response.ok) {
            // 根据接口规范，401表示未授权，403表示禁止访问
            if (response.status === 401) {
                throw new Error('未授权，请先登录');
            } else if (response.status === 403) {
                throw new Error('没有权限删除该帖子');
            }
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        
        // 根据接口规范，处理200和204状态码
        if (response.status === 204) {
            // 204 No Content 表示删除成功但没有返回内容
            return { code: 200, data: 'success', message: '删除成功' };
        }
        return response.json();
    })
    .then(data => {
        console.log('删除成功，服务器返回:', data);
        
        // 从本地数据中删除帖子
        posts = posts.filter(post => post.id !== postId);
        // 重新渲染帖子列表
        renderPosts();
        
        // 显示成功提示
        alert(data.message || '删除成功');
    })
    .catch(error => {
        console.error('删除失败:', error);
        alert('删除失败: ' + error.message);
    });
}

// 添加新帖子（修改为包含ID）
function addPost(author, content) {
    // 生成新ID（实际应用中可能由后端生成）
    const newId = posts.length > 0 ? Math.max(...posts.map(p => p.id)) + 1 : 1;
    posts.push({ id: newId, author, content });
    renderPosts();
}

// 初始化搜索功能
initSearchFunctionality();

renderPosts();

// 示例：添加一个新帖子
addPost('小明', '这是一个关于Java的帖子内容。');

// 点赞帖子函数
function likePost(postId) {
    console.log('尝试点赞帖子，ID:', postId);
    
    // 模拟用户ID（实际应用中可能从登录状态获取）
    const userId = 1; // 这里假设用户ID为1，实际应用中应该从登录状态获取
    
    // 调用点赞接口
    fetch('/api/post/like', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
        },
        body: JSON.stringify({
            articalId: postId,
            userId: userId
        })
    })
    .then(response => {
        console.log('点赞请求已发送，正在等待响应...');
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('点赞成功，服务器返回:', data);
        
        // 更新本地点赞状态
        likedPosts[postId] = true;
        // 重新渲染帖子以更新按钮状态
        renderPosts();
        
        // 显示成功提示
        alert(data.message || '点赞成功');
    })
    .catch(error => {
        console.error('点赞失败:', error);
        alert('点赞失败: ' + error.message);
    });
}

// 取消点赞帖子函数
function unlikePost(postId) {
    console.log('尝试取消点赞帖子，ID:', postId);
    
    // 模拟用户ID（实际应用中可能从登录状态获取）
    const userId = 1; // 这里假设用户ID为1，实际应用中应该从登录状态获取
    
    // 调用取消点赞接口
    fetch('/api/post/unlike', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
        },
        body: JSON.stringify({
            articalId: postId,
            userId: userId
        })
    })
    .then(response => {
        console.log('取消点赞请求已发送，正在等待响应...');
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('取消点赞成功，服务器返回:', data);
        
        // 更新本地点赞状态
        likedPosts[postId] = false;
        // 重新渲染帖子以更新按钮状态
        renderPosts();
        
        // 显示成功提示
        alert(data.message || '取消点赞成功');
    })
    .catch(error => {
        console.error('取消点赞失败:', error);
        alert('取消点赞失败: ' + error.message);
    });
}

// 创建更新帖子的模态框
function createUpdateModal() {
    // 检查是否已存在模态框
    if (document.getElementById('updateModal')) return;
    
    const modalHTML = `
    <div id="updateModal" class="modal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 1000; display: flex; justify-content: center; align-items: center;">
        <div class="modal-content" style="background-color: white; padding: 20px; border-radius: 5px; width: 500px; max-width: 90%;">
            <h2>编辑帖子</h2>
            <input type="hidden" id="editPostId">
            <div class="form-group">
                <label for="editArticalName">文章标题:</label>
                <input type="text" id="editArticalName" class="form-control" placeholder="可选">
            </div>
            <div class="form-group">
                <label for="editContent">帖子内容:</label>
                <textarea id="editContent" class="form-control" rows="4" required></textarea>
            </div>
            <div class="form-group">
                <label for="editIntroduction">简介:</label>
                <input type="text" id="editIntroduction" class="form-control" placeholder="可选">
            </div>
            <div class="modal-buttons" style="display: flex; justify-content: flex-end; gap: 10px; margin-top: 15px;">
                <button id="cancelUpdate">取消</button>
                <button id="confirmUpdate">确认更新</button>
            </div>
        </div>
    </div>`;
    
    document.body.insertAdjacentHTML('beforeend', modalHTML);
    
    // 添加事件监听器
    document.getElementById('cancelUpdate').addEventListener('click', closeUpdateModal);
    document.getElementById('confirmUpdate').addEventListener('click', confirmUpdate);
}

// 打开更新模态框
function openUpdateModal(postId) {
    // 确保模态框已创建
    createUpdateModal();
    
    // 查找要编辑的帖子
    const postToEdit = posts.find(post => post.id === postId);
    if (!postToEdit) {
        alert('未找到该帖子');
        return;
    }
    
    // 填充模态框
    document.getElementById('editPostId').value = postId;
    document.getElementById('editContent').value = postToEdit.content || '';
    document.getElementById('editArticalName').value = postToEdit.articalName || '';
    document.getElementById('editIntroduction').value = postToEdit.introduction || '';
    
    // 显示模态框
    document.getElementById('updateModal').style.display = 'flex';
}

// 关闭更新模态框
function closeUpdateModal() {
    document.getElementById('updateModal').style.display = 'none';
}

// 确认更新帖子
function confirmUpdate() {
    const postId = parseInt(document.getElementById('editPostId').value);
    const articalName = document.getElementById('editArticalName').value.trim();
    const content = document.getElementById('editContent').value.trim();
    const introduction = document.getElementById('editIntroduction').value.trim();
    
    // 验证内容
    if (!content) {
        alert('请输入帖子内容');
        return;
    }
    
    // 构建请求数据
    const postDto = {
        id: postId,
        content: content
    };
    
    // 只包含非空字段
    if (articalName) postDto.articalName = articalName;
    if (introduction) postDto.introduction = introduction;
    
    // 调用更新接口
    updatePost(postDto);
}

// 更新帖子函数
function updatePost(postDto) {
    console.log('尝试更新帖子，ID:', postDto.id);
    
    // 调用更新接口
    fetch('', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            // 如果需要认证，可以在这里添加token等认证信息
            // 'Authorization': 'Bearer ' + token
        },
        body: JSON.stringify(postDto)
    })
    .then(response => {
        console.log('更新请求已发送，正在等待响应...');
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        console.log('更新成功，服务器返回:', data);
        
        // 更新本地数据
        const postIndex = posts.findIndex(post => post.id === postDto.id);
        if (postIndex >= 0) {
            posts[postIndex].content = postDto.content;
            // 如果提供了其他字段，也更新它们
            if (postDto.articalName) posts[postIndex].articalName = postDto.articalName;
            if (postDto.introduction) posts[postIndex].introduction = postDto.introduction;
        }
        
        // 重新渲染帖子列表
        renderPosts();
        
        // 关闭模态框
        closeUpdateModal();
        
        // 显示成功提示
        alert(data.message || '更新成功');
    })
    .catch(error => {
        console.error('更新失败:', error);
        alert('更新失败: ' + error.message);
    });
}



// 创建评论模态框
function createCommentModal() {
    // 检查是否已存在模态框
    if (document.getElementById('commentModal')) return;
    
    const modalHTML = `
    <div id="commentModal" class="modal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 1000; display: flex; justify-content: center; align-items: center;">
        <div class="modal-content" style="background-color: white; padding: 20px; border-radius: 5px; width: 500px; max-width: 90%;">
            <h2>发布评论</h2>
            <input type="hidden" id="commentPostId">
            <div class="form-group">
                <label for="commentContent">评论内容:</label>
                <textarea id="commentContent" class="form-control" rows="4" required></textarea>
            </div>
            <div class="form-group">
                <label for="commentPublisher">发布者:</label>
                <input type="text" id="commentPublisher" class="form-control" required>
            </div>
            <div class="modal-buttons" style="display: flex; justify-content: flex-end; gap: 10px; margin-top: 15px;">
                <button id="cancelComment">取消</button>
                <button id="confirmComment">确认发布</button>
            </div>
        </div>
    </div>`;
    
    document.body.insertAdjacentHTML('beforeend', modalHTML);
    
    // 添加事件监听器
    document.getElementById('cancelComment').addEventListener('click', closeCommentModal);
    document.getElementById('confirmComment').addEventListener('click', confirmComment);
}

// 打开评论模态框
function openCommentModal(postId) {
    // 确保模态框已创建
    createCommentModal();
    
    // 填充帖子ID
    document.getElementById('commentPostId').value = postId;
    
    // 清空表单
    document.getElementById('commentContent').value = '';
    document.getElementById('commentPublisher').value = '';
    
    // 显示模态框
    document.getElementById('commentModal').style.display = 'flex';
}

// 关闭评论模态框
function closeCommentModal() {
    document.getElementById('commentModal').style.display = 'none';
}

// 确认发布评论
function confirmComment() {
    const postId = parseInt(document.getElementById('commentPostId').value);
    const content = document.getElementById('commentContent').value.trim();
    const publisher = document.getElementById('commentPublisher').value.trim();
    
    // 验证内容
    if (!content || !publisher) {
        alert('请填写评论内容和发布者信息');
        return;
    }
    
    // 构建请求数据
    const commentDto = {
        content: content,
        postId: postId,
        publisher: publisher
    };
    
    // 调用发布评论接口
    publishComment(commentDto);
}

// 发布评论函数
function publishComment(commentDto) {
    console.log('尝试发布评论，帖子ID:', commentDto.postId);
    
    // 模拟获取用户信息（实际应用中应该从登录状态获取）
    const userId = 1; // 这里假设用户ID为1
    const username = '当前用户'; // 这里假设用户名为'当前用户'
    
    // 调用发布评论接口
    fetch('/api/comment/publish', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Authorization': `${username}:${userId}`
        },
        body: JSON.stringify(commentDto)
    })
    .then(response => {
        console.log('评论发布请求已发送，正在等待响应...');
        
        // 检查响应状态
        if (response.status === 200 || response.status === 201) {
            return response.json();
        } else if (response.status === 401) {
            throw new Error('未授权，请先登录');
        } else if (response.status === 403) {
            throw new Error('没有权限发布评论');
        } else if (response.status === 404) {
            throw new Error('未找到该帖子');
        } else {
            throw new Error(`发布失败: 服务器返回 ${response.status}`);
        }
    })
    .then(data => {
        console.log('评论发布成功，服务器返回:', data);
        
        // 关闭模态框
        closeCommentModal();
        
        // 显示成功提示
        alert(data.message || '评论发布成功');
    })
    .catch(error => {
        console.error('评论发布失败:', error);
        alert('评论发布失败: ' + error.message);
    });
}

// 修改renderPosts函数，添加评论按钮
// 查找原renderPosts函数并在post-actions中添加评论按钮

// 在window.onload中初始化时，确保已定义createCommentModal函数并创建模态框结构